Link to USGS home page
Internal USGS Access Only

Learning HTML - Tables

Table Example
Tables can be very complex, and so the syntax for specifying tales can be complicated. Normally cells, rows and columns will grow to fit whatever is placed in them.
<table border="1" cellpadding="4">
  <thead>
    <tr>
      <th>Title 1</th>   <th>Title 2</th>
    </tr>
  </thead>

  <tbody>
    <tr>
      <td>cell 1</td>   <td>cell 2</td>
    </tr>

    <tr>
      <td>cell 3</td>   <td>cell 4</td>
    </tr>
  </tbody>
</table>
 
Title 1 Title 2
cell 1 cell 2
cell 3 cell 4

Table Syntax
table - start a table
The TABLE element has several attributes; The BORDER attribute specifies how many pixels thick the cell borders should be (0 = none by default), and CELLPADDING defines how many pixels of padding should be inserted between the contents of cell and the border.
tbody and thead - HTML 4 features (optional)
The TBODY, THEAD and TFOOT elements will allow HTML 4 browsers to repeat header and footer information on the tops and bottoms of paper copies of very long tables, or to provide table scrolling.
tr - a Table Row
Defines one row of a table.
th - a Heading Cell
Can be a row or column heading, often rendered bold and centered within the cell
td - an Ordinary (Data) Cell
A cell can contain almost anything; text, links, lists, graphics, even another table.

Many browsers do not like completely empty cells. A common practice is to place the non-breaking space entity, &nbsp; in empty cells. The example to the right has a completely empty cell in the upper right, and a &nbsp; in the lower left.

Title 1 Title 2
cell 1
  cell 4

slide 13


[up]
"Mastering a Web Site" online course
Created and maintained by Lorna Schmid and David Boldt.
http://water.usgs.gov/usgs/training/webmaster/html_tables.html    
Last modified: Wed Nov 12 17:41:13 EST 2003